<template>
    <div class="setting">
        <div class="hotProblem">热门问题</div>
        <div  @click="linkTo('/helpdetail?id='+item.id)" 
        v-for="(item,index) in dataList" 
        :key="index" class="message-other">
             <div class="message-left over-hidden">{{item.title}}</div>
            <div class="person-desc2"> <img class="person-desc2-img" src="../../images/fanhui@2x.png" alt=""></div>
        </div>
        <div v-if="!dataList.length" style="text-align: center;font-size: .3rem;margin-top: 1rem;"> 暂无数据</div>
    </div>
</template>
<script>
import CONSTANT from "../../../wechat/static/constant/urlconstant";
import common from "../../../wechat/static/common/common";

export default {
    data() {
        return {
            dataList:[]
        };
    },
    mounted(){
        this.getList()
    },
    methods:{
      linkTo(link) {
        this.$router.push(link);
        },
      getList() {
        let param = {
            pageIndex: 1,
            pageSize: 1000,
        };
        this.$vux.loading.show({
            text: "加载中"
        });
        let url = CONSTANT.LIST.helpPage;
        common.post(url, param, res => {
            this.$vux.loading.hide();
            if (res.code == 200) {
                this.dataList = res.data.bussData
            }
        });
     },
    }
    
}
</script>
<style lang="less">
.setting{
     position: relative;
    overflow: hidden;
    .hotProblem{
        padding: .21rem 0 .25rem .22rem;
        height:.23rem;
        font-size:.24rem;
        font-family:PingFang-SC-Regular;
        font-weight:400;
        color:rgba(126,86,198,1);
        line-height:.23rem;
    }
    .message-other{
        position: relative;
        width:7.5rem;
        height:1rem;
        background:rgba(255,255,255,1);
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-left: .24rem;
        padding-right: .28rem;
        box-sizing: border-box;
        .message-left{
            font-size:.28rem;
            font-family:PingFang-SC-Medium;
            font-weight:500;
            color:rgba(51,51,51,1);
        }
        .person-desc{
            .person-desc-img{
                width:.96rem;
                height:.96rem;
                border-radius:50%;

            }
        }
        .person-desc2{
            font-size:.28px;
            // width: 6.9375rem /* 111/16 */
            font-family:PingFang-SC-Medium;
            font-weight:500;
            color:rgba(102,102,102,1);
            line-height:.31rem;
            .person-desc2-img{
                margin-left: .26rem;
                width:.12rem;
                height:.22rem;
            }
        }
        .person-desc3{
            .person-desc2;
            color:rgba(126,86,198,1);
        }
    }
    .message-other :after{
        content: " ";
        position: absolute;
        height: 1px;
        right: 0;
        bottom: 0;
        left:.24rem;
        background-color: RGBA(232, 232, 232, 1);
        }
    .message-other2{
        .message-other;
    }
    

}

</style>
